// @flow
import React, { Component, type Node } from 'react';
import { connect } from 'react-redux';
import type { State } from 'store';
// import type { UserData } from 'store/modules/user';
import { BaseActions } from 'store/actionCreators';
import UserMenuButton from 'components/Header/UserMenuButton';

type Props = {
    thumbnail: string
};

class UserMenuButtonContainer extends Component<Props> {
    onClick = () => {
        BaseActions.showUserMenu();
    };
    render() {
        const { onClick } = this;
        const { thumbnail } = this.props;

        return <UserMenuButton thumbnail={thumbnail} onClick={onClick} />;
    }
}
// 把store导入Pros
const mapStatetoProps = ({ auth }: State) => {
    return {
        thumbnail: auth.user && auth.user.thumbnail, // && user.user.userThumbnail
        username: auth.user && auth.user.name
    };
};

const mapDispatchtoProps = () => ({});
export default connect(
    mapStatetoProps,
    mapDispatchtoProps
)(UserMenuButtonContainer);
